<template>
  <div class="common-details">
    <customDetailsTopbar :title="title" flag @back="back" />
    <div class="d-scroll listInner px-1">
      <div class="baseLoad bg-white">
        <div class="py-1 px-1 bg-white">
          <div v-for="(item, index) in descList" :key="index">
            <div>
              <custom-details-item :icon="item.icon" :label="item.label">
                <template #valueSlot>
                  <div v-if="item.label === '能源管理体系认证证书' || item.label === '清洁生产审核报告' || item.label === '专家评估验收意见'">
                    <template v-if="item.label === '能源管理体系认证证书'">
                      <el-link type="primary" @click="openAttachPopUp(item.value)">查看</el-link>
                    </template>
                    <el-link v-else type="primary" @click="handleDownLoad(item.uuid)">{{ item.value }}</el-link>
                  </div>
                  <span v-else>{{ item.value }}</span>
                </template>
              </custom-details-item>
            </div>
          </div>
        </div>
        <div v-for="(list,index) in ProjectFileList" :key="index" class="list_item px-1">
          <customTitle :is-line="true" bg-color="#3795ff" :title="list.label" />
          <template v-if="listData && listData.length>0">
            <el-table :data="listData" style="width: 100%" size="small" class="tableList mt-1">
              <el-table-column prop="fileName" label="材料名称" align="center" show-overflow-tooltip />
              <el-table-column prop="fileTime" label="上传时间" align="center" min-width="130" />
              <el-table-column label="操作" align="center" width="80">
                <template slot-scope="{ row }">
                  <el-link type="primary" @click="handleDownLoad(row.fileUuid)">下载</el-link>
                </template>
              </el-table-column>
            </el-table>
          </template>
          <el-empty v-else description="暂无数据" />
        </div>
      </div>
    </div>
    <attachPopUp ref="attachPopUp" file-name-key="attachName" file-url-key="attachUuid" />
  </div>
</template>

<script>
import { cleanerProductionByID, energyCertifyById } from '@/api/energySources'
import commonList from '@/assets/mixin/commonList'
export default {
  mixins: [commonList],
  data() {
    return {
      descListMap: {
        '能源管理体系': [
          { field: 'companyName', label: '企业名称', value: '/', icon: '&#xe790;' },
          { field: 'industryType', label: '行业类别', value: '/', icon: '&#xe634;' },
          // { field: 'category', label: '企业类别', value: '/', icon: '&#xe790;' },
          { field: 'registeAddress', label: '所在地', value: '/', icon: '&#xe87e;' },
          { field: 'isEnergy', label: '是否重点用能单位', value: '/', icon: '&#xe725;' },
          { field: 'receiveTime', label: '证书初领日期', value: '/', icon: '&#xe617;' },
          { field: 'certifyStarTime', label: '证书有效期（起）', value: '/', icon: '&#xe617;' },
          { field: 'certifyEndTime', label: '证书有效期（止）', value: '/', icon: '&#xe617;' },
          { field: 'files', label: '能源管理体系认证证书', value: '/', icon: '&#xe677;' },
          { field: 'uploadTime', label: '上传时间', value: '/', icon: '&#xe685;' }
        ],
        '清洁生产管理': [
          { field: 'entryName', label: '清洁生产项目名称', value: '/', icon: '&#xe98f;' },
          { field: 'companyName', label: '企业名称', value: '/', icon: '&#xe790;' },
          { field: 'industry', label: '行业类别', value: '/', icon: '&#xe634;' },
          { field: 'auditType', label: '审核类型', value: '/', icon: '&#xe791;' },
          { field: 'startTime', label: '开始时间', value: '/', icon: '&#xe617;' },
          { field: 'endTime', label: '结束时间', value: '/', icon: '&#xe617;' },
          { field: 'auditOrganization', label: '审核机构', value: '/', icon: '&#xe725;' },
          { field: 'auditTime', label: '审核时间', value: '/', icon: '&#xe617;' }
          // { field: 'cleanerAttachName', label: '清洁生产审核报告', value: '/', icon: '&#xe677;' },
          // { field: 'expertAttachName', label: '专家评估验收意见', value: '/', icon: '&#xe677;' }
        ]
      },
      ProjectFileListMap: {
        '清洁生产管理': [
          {
            label: '项目相关附件',
            value: [
              { label: '上传时间', value: 'fileTime', icon: '&#xe6a4;' },
              { isFile: true, label: '材料名称', value: 'fileName', UUID: 'attachUuid', icon: '&#xe677;' }
            ],
            table: []
          }
        ]
      },
      ProjectFileList: [],
      descList: [],
      listData: [],
      detailFunMap: {
        '能源管理体系': energyCertifyById,
        '清洁生产管理': cleanerProductionByID
      },
      title: '',
      titleMap: {
        '能源管理体系': '能源管理体系详情',
        '清洁生产管理': '清洁生产项目详情'
      }
    }
  },
  async mounted() {
    // this.layout.showLoading()
    this.layout.showAreaLoading(['.baseLoad'])
    const { name } = this.$route.query
    this.descList = this.descListMap[name]
    this.title = this.titleMap[name]
    this.ProjectFileList = this.ProjectFileListMap[this.$route.query.name]
    const { status, data } = await this.detailFunMap[this.$route.query.name]({ id: this.$route.query.id })
    if (status === 0 && data) {
      this.descList.forEach(v => {
        v.value = data[v.field] ? data[v.field] : ''
        if (v.field === 'cleanerAttachName' || v.field === 'expertAttachName') {
          v.uuid = data[v.field.replaceAll('Name', 'UUID')]
        }
      })
      if (name === '清洁生产管理') {
        this.ProjectFileList[0].table = data.files
        this.listData = data.files
      }
    }
    // this.layout.hideLoading()
    this.layout.hideAreaLoading(['.baseLoad'])
  },
  methods: {
    back() {
      this.$router.back()
    }
  }
}
</script>
<style lang="scss" scoped>
.iconfont {
  display: none;
}
</style>
